﻿

<!doctype html>
<html>
<head>
<title>我的车辆列表</title>
<meta http-equiv="Content-Type" content="text/html;charset=utf-8" />
<meta name="author" content="wangchunpeng">
<meta name="HandheldFriendly" content="True">
<meta name="viewport" content="width=device-width,user-scalable=no"/>
<meta name="apple-mobile-web-app-capable" content="yes">
<meta name="apple-mobile-web-app-status-bar-style" content="black">
<meta name="format-detection" content="telephone=no">
<meta http-equiv="cleartype" content="on">
<link rel="stylesheet" href="${ctx}/resource/css/style.css" media="screen"/>
<script type="text/javascript" src="${ctx}/resource/js/zepto.min.v1.js"></script>
<script type="text/javascript" src="${ctx}/resource/js/common-1.0.js"></script>
<script type="text/javascript" src="${ctx}/resource/js/budingweiche.v1.1.js"></script>
<script type="text/javascript">
    var TAP = ("WEB"=="WEB")?"mousedown":"tap";
    var EnablE = true;
    var dataForWeixin={
        appId:'wx29e576d65e718bd8',
        timeLineTitle:'违章查询，尽在【全国交通网】公众帐号！',
        appMsgTitle:document.title,
        appMsgDesc:'违章查询，尽在【全国交通网】公众帐号！',
        imgUrl:"http://img.buding.cn/common/2014/04/24/9af57ff45e88c1a19e6d6add88e80e2d.jpeg",
        link:location.href
    };
    var callbacksForWeixin={
        ready:function () {},
        cancel:function (resp) {},
        fail:function (resp) {},
        confirm:function (resp) {},
        all:function (resp) {},
        globalConfirm:function(resp){
            $.post('json.asp?action=hi');
        }
    };
</script>
</head>
<body>
<div id="wrap"><style>

/* Swipe 2 required styles */

/*#header {
  overflow: hidden;
  visibility: hidden;
  position: relative;
}
.swipe-wrap {
  overflow: hidden;
  position: relative;
}
.swipe-wrap > div {
  float:left;
  width:100%;
  position: relative;
  line-height: 0;
}
#header img {
}
*//* END required styles */

.swipe-wrap div,
.swipe-wrap div a {line-height: 0;}

</style>
<div id="header">
  <div class="swipe-wrap">
    <div>
         <a target="_blank" href="#">
         <img src="${ctx}/resource/css/m.jpg" width="100%"></a>
      </div>
      <!-- <div>
         <img src="http://img.buding.cn/common/2014/04/25/045873a94f1f2138d185701b8c718ce7.jpeg" width="100%">
         <div class="linkto">
              <a target="_blank" href="http://dl.weiche.me/channel/buding"><img class="downloadbtn"  src="http://img.buding.cn/coupon/2013/09/17/36bfd48b01795c4e0b4d21fbe780abc3.png" /></a>
         </div>
      </div> -->
   </div>
</div>

<!--<script src='js/swipe.js'></script>-->
<script type="text/javascript">
	/*
    var followloop;
    window.onload=function(){
        followloop = setInterval(function(){
            Jax.follow();
        },1000);
    }
    */
   (function() {
      var hm = document.createElement("script");
      var ua = navigator.userAgent.toLowerCase();
      if(ua.match(/micromessenger/i)=="micromessenger") {
        setTimeout(function(){Jax.follow();},5000);
      }
    })();
/*
  var elem = document.getElementById('header');
  window.mySwipe = Swipe(elem, {
     // startSlide: 0,
     auto: 2000,
     speed: 500,
    // continuous: true,
    // disableScroll: true,
    // stopPropagation: true,
    // callback: function(index, element) {},
    // transitionEnd: function(index, element) {}

  });
*/
</script>
<div id="vlist">
    <ul class="list">
            
            <#if objectlist??>
            	<#list objectlist as o>
		            <li id="vid_${(o.hphm)!''}"  jax-value="args=${(o.id)!''}&openid=${(openid)!''}&action=edit">
		                <h2>${(o.hphm)?upper_case}</h2>
		                <p>扣分 <span class="the_point" id="kf${(o.hphm)!''}">0</span> 
		                	罚款<span class="the_fine"  id="fk${(o.hphm)!''}">0元</span>
		                </p>
		                <div class="circle">
		                    <span class="the_count"   id="wz${(o.hphm)!''}">0</span>
		                    <p>违章</p>
		                </div>
		                <div class="settingbtn">
		                    <div class="editbtn">修改</div>
		                    <div class="delbtn">删除</div>
		                </div>
		            </li>
		         </#list>
			</#if>
			<script>
			 
          	<#if fenz??>
        	<#list fenz as s> 
        	$("#kf${(s.vehicle_id)!}").html('${(s.unhandled_violation_point)!''}');
        	$("#fk${(s.vehicle_id)!}").html('${(s.unhandled_violation_fine)+"元" }');
        	$("#wz${(s.vehicle_id)!}").html('${(s.unhandled_count)!''}');
         </#list>     
                  </#if>
			</script>
            </ul>
    <p class="button parentbtn">
        <a class="btn router" goto="${ctx}/wzcx?add=add&openid=${(openid)!}"><img src="${ctx}/resource/css/add.png" /> 添加车辆</a>
        <a class="btn edit-vehicle" value="0"><img src="${ctx}/resource/css/edit.png" /> <span>编辑车辆</span></a>
    </p>
    <script type="text/javascript">
    var openid="${(openid)!}";
        function showpanel($this){
            var mainheight = $this.height();
            var settingbtn = $this.find('div.settingbtn');
            settingbtn.height(mainheight-1);
            settingbtn.css('right','-130px').show();
            setTimeout(function(){
                 settingbtn.animate({right:0},200);
            },10);
            $this.off(TAP);
        }
        function hidepanel($this){
            var settingbtn = $this.find('div.settingbtn');
            settingbtn.animate({right:-130},200,function(){settingbtn.hide();});
            $this.on(TAP,function(){
                Jax.loading();
                Jax.loaded_delay();
                location.href="${ctx}/wzcx/violations?"+$this.attr('jax-value')+"&openid="+openid;
            });
        }

       /*  function get_latest_infos(){
            $.post('${ctx}/wzcx2/listJson?openid='+openid,'action=list',function(vlist){
                try{
                   // var vehs = $.parseJSON(vlist);
                    var vehs = vlist;
                    for(var i in vehs){
                       if(vehs[i].vehicle_id){
                            $("#vid_"+vehs[i].vehicle_id+" span.the_point").text(vehs[i].unhandled_violation_point);
                            $("#vid_"+vehs[i].vehicle_id+" span.the_fine").text(vehs[i].unhandled_violation_fine+'元');
                            $("#vid_"+vehs[i].vehicle_id+" span.the_count").text(vehs[i].unhandled_count);
                       }
                    }
                }catch(e){
                 //   setTimeout(function(){get_latest_infos();},100);
                }
		if($('.imgloading').attr('src')){
		  // setTimeout(function(){get_latest_infos();},100);
		}
            });
        } */
		Zepto(function($){
			dataForWeixin.appMsgTitle = '点击查询我的违章信息';
			dataForWeixin.timeLineTitle = '【'+dataForWeixin.appMsgTitle +"】"+dataForWeixin.appMsgDesc;

			dataForWeixin.link = 'http://wx.wcar.net.cn/vehicle-action.html';
        //    get_latest_infos();
            $('#vlist li').on(TAP,function(){
                Jax.loading();
                Jax.loaded_delay();
                location.href="${ctx}/wzcx/violations?"+$(this).attr('jax-value');
            });
            $('.edit-vehicle').on(TAP,function(){
                if($(this).attr('value') == 0){
                    $('#vlist li').each(function(){
                       showpanel($(this));
                    });
                    $(this).attr('value',1);
                    $(this).find('span').text('取消编辑');
                }else{
                    $('#vlist li').each(function(){
                        hidepanel($(this));
                    });
                    $(this).attr('value',0);
                    $(this).find('span').text('编辑车辆');
                }
            });

            $('#vlist li').on('swipeLeft',function(){
               showpanel($(this));
            });

            $('#vlist li').on('swipeRight',function(){
               hidepanel($(this));
            });

            $('.editbtn').on(TAP,function(e){
                e.preventDefault();
                var data = $(this).parent().parent().attr('jax-value');
                var do_edit = function(){
                    Jax.loading();
                    Jax.loaded_delay();
                    location.href="${ctx}/wzcx?"+data;
                }
                setTimeout(do_edit, 100);
            });

            $('.delbtn').on(TAP,function(e){
                e.preventDefault();
                var $thisli = $(this).parent().parent();
                var data = $thisli.attr('jax-value');
                if(confirm('你确定要删除这条车辆信息么?')){
                    Jax.loading();
                    $.post('${ctx}/wzcx/delete','action=del&'+data,function(msg){
                         Jax.loaded();
                         try{
                              //var obj = $.parseJSON(msg);
                              var obj = msg;
                              if(obj.msg == 'ok'){
                                  $thisli.fadeOut();
                              }else{
                                alert('删除失败, 请稍后再试');
                              }
                           }catch(e){
                              alert('删除失败, 请稍后再试');
                           }
                    });
                }
            });
        });

    </script>

</div>
    </div>
    <style type="text/css">
       #mask,#mask_black{position:fixed;top:0;width:100%;height:100%;left:0;background: #fff;opacity: 0.7;display: none}
       #mask_black{background: #000}
       img.loading{position: fixed;width: 80px;z-index:9999;display: none; left: 50%; top: 50%; margin-left:-40px; margin-top:-40px; /*transform: translate(-50%, -50%); -webkit-transform:translate(-50%, -50%);-moz-transform:translate(-50%, -50%);*/}
       #follow-us{max-width:640px;min-width:320px;background: #fff;opacity: 0.94;padding-top:15px;padding-bottom:15px;width:100%;position: fixed;top:-140px;z-index: 99999;border-bottom:1px solid #ddd;box-shadow:0px 0px 4px #ddd;display: none;}
        #follow-us img{width:60px;border-radius: 5px;float:left;margin-top: 2px;margin-left:20px;}
        #follow-us p{font-size:14px;line-height: 1.5;padding-left: 95px;}
        #follow-us p b{color:#16d24c;}
        #follow-us p.pbtn{text-align:center;padding:0px;margin:0;font-size:12px;margin-top:10px;}
        #follow-us p.pbtn>button{font-size: 14px; padding-bottom: 9px;padding-top: 9px;border-radius: 2px 10px; width: 35%;}
        button { color: #004995; padding-top: 5px; padding-bottom: 5px; width: 50%; -webkit-appearance: none; border: 0; background: #55C126; color: #FFF; font-size: 18px; padding-top: 13px; padding-bottom: 13px; border-radius: 2px 15px 2px 15px;}
    </style>
     <div id="mask"></div>
     <img src="http://img.buding.cn/common/2014/02/26/bda018f19c5e61a658c5eb2faaf7b7e4.gif" class="loading" />
     <script type="text/javascript" src="${ctx}/resource/js/wechat.min.v1.js"></script>
     <script type="text/javascript">
        WeixinApi.ready(function(Api){
            Api.shareToFriend(dataForWeixin, callbacksForWeixin);
            Api.shareToTimeline(dataForWeixin, callbacksForWeixin);
            Api.shareToWeibo(dataForWeixin, callbacksForWeixin);
        });
      
     </script>
    </body>
</html>
